<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Test01</title>
    <script src="https://unpkg.com/vue/dist/vue.js" type="text/javascript"></script>
    <style>
        /*.class01 {*/
        /*    color: red;*/
        /*    font-size: 18px;*/
        /*    background-color: #0b2e13;*/
        /*}*/
    </style>
</head>
<body>

<div id="app">
    <div :style="'color:' + dcolor + ';font-size:' + dfont_size">Green Template 01</div>
    <div :style="style01">Green Template 02</div>
    <div :style="[style01,style02]">Green Template 03</div>
</div>

<script>
    let vm = new Vue({
        el: '#app',
        data: {
            dcolor: 'red',
            dfont_size: '28px',
            style01: {
                color: 'red',
                fontSize: '28px'
            },
            style02: {
                backgroundColor: '#0b2e13'
            }
        }
    });

    vm.style01.color = 'green';

</script>

</body>
</html>